<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      html {
        font-family: sans-serif;
      }

      body {
        margin: 0;
      }

      header {
        background: purple;
        height: 100px;
      }

      h1 {
        text-align: center;
        color: white;
        line-height: 100px;
        margin: 0;
      }

      article {
        padding: 10px;
        margin: 10px;
        background: aqua;
      }

      /* Add your flexbox CSS below here */

      section {
        display: flex;
        /* flex-direction: row;
        flex-wrap: wrap-reverse; */
        flex-flow: row wrap;
        justify-content: space-evenly;
        align-items: flex-end;
      }

      article {
        /* width: 300px; */
        /* flex-basis: auto; */
        flex: 200px;
      }
    </style>
  </head>
  <body>
    <header>
      <h1>Sample flexbox example</h1>
    </header>
    <section>
      <article>
        <h2>First article</h2>

        <p>a</p>
      </article>

      <article>
        <h2>Second article</h2>

        <p>表</p>
      </article>

      <article>
        <h2>Third article</h2>

        <p>c</p>

        <p>d</p>
      </article>

      <!-- <article>
        <h2>Fourth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>
      </article>

      <article>
        <h2>Fifth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>
      </article>

      <article>
        <h2>Sixth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>

        <p>
          Cray food truck brunch, XOXO +1 keffiyeh pickled chambray waistcoat
          ennui. Organic small batch paleo 8-bit. Intelligentsia umami wayfarers
          pickled, asymmetrical kombucha letterpress kitsch leggings
          cold-pressed squid chartreuse put a bird on it. Listicle pickled man
          bun cornhole heirloom art party.
        </p>
      </article>

      <article>
        <h2>Seventh article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>
      </article>

      <article>
        <h2>Eighth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>
      </article>

      <article>
        <h2>Ninth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>

        <p>
          Cray food truck brunch, XOXO +1 keffiyeh pickled chambray waistcoat
          ennui. Organic small batch paleo 8-bit. Intelligentsia umami wayfarers
          pickled, asymmetrical kombucha letterpress kitsch leggings
          cold-pressed squid chartreuse put a bird on it. Listicle pickled man
          bun cornhole heirloom art party.
        </p>
      </article>

      <article>
        <h2>Tenth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>
      </article>

      <article>
        <h2>Eleventh article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>
      </article>

      <article>
        <h2>Twelfth article</h2>

        <p>
          Tacos actually microdosing, pour-over semiotics banjo chicharrones
          retro fanny pack portland everyday carry vinyl typewriter. Tacos PBR&B
          pork belly, everyday carry ennui pickled sriracha normcore hashtag
          polaroid single-origin coffee cold-pressed. PBR&B tattooed trust fund
          twee, leggings salvia iPhone photo booth health goth gastropub
          hammock.
        </p>

        <p>
          Cray food truck brunch, XOXO +1 keffiyeh pickled chambray waistcoat
          ennui. Organic small batch paleo 8-bit. Intelligentsia umami wayfarers
          pickled, asymmetrical kombucha letterpress kitsch leggings
          cold-pressed squid chartreuse put a bird on it. Listicle pickled man
          bun cornhole heirloom art party.
        </p>
      </article> -->
    </section>
  </body>
</html>
